import React, { useState, useEffect, useRef } from 'react'
import { Tabs } from 'antd'
import ExamTab from './ExamTab'
import ScoreTab from './ScoreTab'
import { selectClassAsync } from '../../api/class'
import { selectStudentAsync } from '../../api/student'
import { selectExamAsync } from '../../api/exam'
import { selectScoreAsync } from '../../api/score'

const { TabPane } = Tabs

function Exam() {
    const [examData, setExamData] = useState([])
    const [scoreData, setScoreData] = useState([])
    const [studentData, setStudentData] = useState([])
    const [classData, setClassData] = useState([])
    const [pageLoading, setPageLoading] = useState(false)
    const tabsEle = useRef(null)
    // 异步请求函数抽象
    const asyncRequest = async (fn, payload) => {
        payload = payload || []
        const res = await fn(...payload)
        if (res.code === 0) {
            return res.data ? res.data : true
        }
    }
    useEffect(() => {
        setPageLoading(true)
        async function asyncFn() {
            setExamData(await asyncRequest(selectExamAsync))
            setScoreData(await asyncRequest(selectScoreAsync))
            setStudentData(await asyncRequest(selectStudentAsync))
            setClassData(await asyncRequest(selectClassAsync))
            // setPageLoading(false)
        }
        asyncFn()
    }, [])
    return (
        <>
            <Tabs type="card">
                <TabPane tab="考试管理" key="1" forceRender>
                    <ExamTab
                        classData={classData}
                        examData={examData}
                        setExamData={setExamData}
                        studentData={studentData}
                        scoreData={scoreData}
                        setScoreData={setScoreData}
                        pageLoading={pageLoading}
                        setPageLoading={setPageLoading}
                    />
                </TabPane>
                <TabPane tab="成绩录入" key="2" forceRender>
                    <ScoreTab
                        classData={classData}
                        studentData={studentData}
                        examData={examData}
                        scoreData={scoreData}
                        setScoreData={setScoreData}
                        pageLoading={pageLoading}
                        setPageLoading={setPageLoading}
                        tabsEle={tabsEle}
                    />
                </TabPane>
            </Tabs>
        </>
    )
}

export default Exam
